// pages/goods_list/index.js
/*1.用户上滑页面 下拉加载下一页数据
1.找到滚动条触底事件 微信文档找
2.判断是否还有下一页数据
①获取总页数(total/页容量pageSize) Math.ceil(39/10)
②获取当前的页码值 判断一下页码值是否大于总页数
表示没有下一页数据 
3.如果没有了,弹出一个提示框
4.如果有 请求下一页的数据并渲染

*/

import { request } from "../../request/index"
Page({

  data: {
    tabs: [
      {
        id: 0,
        name: "综合",
        isactive: true
      },
      {
        id: 1,
        name: "流行",
        isactive: false
      },
      {
        id: 2,
        name: "随机",
        isactive: false
      }
    ],
    //商品数据
    goodsList: [],
    totalPage: 0,
  },

  //接口要的数据
  Query: {
    query: '',
    cid: "",
    pagenum: 1,
    pagesize: 10,
  },
  //子组件传过来的点击事件
  handletabsClick(e) {
    // 获取传过来的索引
    const { index } = e.detail
    //修改原数组
    let { tabs } = this.data
    tabs.forEach(item => {
      if (item.id === index) {
        item.isactive = true
      } else {
        item.isactive = false
      }
    })
    //重新赋值tabs
    this.setData({
      tabs
    })
  },

  //获取商品列表的数据
  async getGoodsList() {
    const { data: res } = await request({
      url: "/goods/search",
      data: this.Query
    })
    const total = res.message.total
    const totalPage = Math.ceil(total / this.Query.pagesize)
    this.setData({
      goodsList: [...this.data.goodsList, ...res.message.goods],//拼接数组
      totalPage
    })
  },
  /**
  * 生命周期函数--监听页面加载
  */
  onLoad: function (options) {
    this.Query.cid = options.cid||"" //赋值传过来的cid
    this.Query.query = options.query||""//首页过来的话只有query
    this.getGoodsList();
  },
  //下拉加载数据
  onReachBottom() {
    const { totalPage } = this.data
    if (this.Query.pagenum >= totalPage) {
      //大于 弹出提示框
      wx.showToast({
        title: '我真的是一滴都没有了',
        icon: 'none',
        duration: 1500,
      });
    } else {
      //发起请求加载下一页数据
      this.Query.pagenum++
      const newGoods = this.getGoodsList()
    }
  },

  //用户下拉刷新
  onPullDownRefresh() {
    //重置商品数组
    this.setData({
      goodsList: []
    })
    //重置页码
    this.Query.pagenum = 1;
    //重新发送请求
    this.getGoodsList()
    //手动关闭刷新效果
    wx.stopPullDownRefresh()
  }
})